<#assign ctx=request.contextPath>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8"/>
    <title>系统管理</title>
    <meta name="keywords" content=""/>
    <meta name="description" content=""/>
    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
    <link href="${ctx}/static/css/bootstrap.min.css" rel="stylesheet"/>
    <link rel="stylesheet" href="${ctx}/static/css/font-awesome.min.css"/>
    <link rel="stylesheet" href="${ctx}/static/datacenter/css/font-awesome.min.css"/>
    <link rel="stylesheet" href="${ctx}/static/css/ace.min.css"/>
    <link rel="stylesheet" href="${ctx}/static/css/ace-rtl.min.css"/>
    <link rel="stylesheet" href="${ctx}/static/css/ace-skins.min.css"/>
    <!--[if lte IE 8]>
    <link rel="stylesheet" href="${ctx}/static/css/ace-ie.min.css"/>
    <![endif]-->
    <link rel="stylesheet" href="${ctx}/static/dlshouwen.grid.v1.2.1/dlshouwen.grid.min.css"/>
    <script src="${ctx}/js/ace-extra.min.js"></script>
    <!--[if lt IE 9]>
    <script src="${ctx}/js/html5shiv.js"></script>
    <script src="${ctx}/js/respond.min.js"></script>
    <![endif]-->
    <!-- jedate-->
    <link rel="stylesheet" href="${ctx}/static/jedate/skin/jedate.css"/>
    <script src="${ctx}/static/jedate/jedate.js"></script>

		<#include "/common.ftl"/>
</head>
<style>
</style>

<body>
        <#include "/head.ftl" />
<div class="main-container" id="main-container">
    <script type="text/javascript">
        try {
            ace.settings.check('main-container', 'fixed')
        } catch (e) {
        }
    </script>

    <div class="main-container-inner">
        <a class="menu-toggler" id="menu-toggler" href="#">
            <span class="menu-text"></span>
        </a>
                <#include "/menu.ftl"/>
        <div class="main-content">
            <div class="breadcrumbs" id="breadcrumbs">
                <script type="text/javascript">
                    try {
                        ace.settings.check('breadcrumbs', 'fixed')
                    } catch (e) {
                    }
                </script>
                <ul class="breadcrumb">
                    <li>
                        <i class="icon-home home-icon"></i>
                        <a href="${ctx}/admin/index">首页</a>
                    </li>
                    <li><a href="#">系统监控</a></li>
                    <li class="active">操作日志</li>
                </ul><!-- .breadcrumb -->

                <div class="nav-search" id="nav-search">
                    <form class="form-search">
								<span class="input-icon">
									<input type="text" placeholder="Search ..." class="nav-search-input"
                                           id="nav-search-input" autocomplete="off"/>
									<i class="icon-search nav-search-icon"></i>
								</span>
                    </form>
                </div><!-- #nav-search -->
            </div>
            <div class="page-content">
                <div class="form-horizontal">
                    <div class="col-xs-12"
                         style="margin-top: 20px; padding-right: 0px !important;padding-left: 0px !important;  ">
                        <label class="control-label col-sm-1 no-padding-right">开始时间</label>
                        <div class="col-sm-2">
                            <input class="form-control" name="stime" id="stime" type="text"
                                   placeholder="开始时间..."/>
                        </div>
                        <label class="control-label col-sm-1 no-padding-right">结束时间</br></label>
                        <div class="col-sm-2">
                            <input class="form-control" name="etime" id="etime" type="text"
                                   placeholder="结束时间..."/>
                        </div>
                        <div class="col-sm-1">
                            <button id="btnSearch" class="btn btn-primary btn-sm" type="button">
                                <i class="fa fa-search"></i>查询
                            </button>
                        </div>
                    </div>
                </div>
                <div class="row" style="margin-top:5px;">
                    <div class="widget-box transparent ui-sortable-handle"
                         style="opacity: 1; z-index: 0;">
                        <div class="widget-header" style="position: initial;">
                            <h5 class="widget-title lighter">操作日志</h5>
                        </div>
                        <div class="widget-body" style="display: block;">
                            <div class="widget-main padding-6 no-padding-left no-padding-right">
                                <input id="pageNum" type="hidden" value="${page.pageNum }">
                                <input id="pageSize" type="hidden" value="${page.pageSize }">
                                <input id="orderByColumn" type="hidden" value="${page.orderByColumn }">
                                <input id="orderByType" type="hidden" value="${page.orderByType }">
                                <div id="dtGridContainer" class="dlshouwen-grid-container"></div>
                                <div id="dtGridToolBarContainer" class="dlshouwen-grid-toolbar-container"></div>
                            </div>
                        </div>
                    </div>
                </div>
            </div><!-- /.page-content -->
        </div><!-- /.main-content -->
    </div><!-- /.main-container-inner -->

    <a href="#" id="btn-scroll-up" class="btn-scroll-up btn btn-sm btn-inverse">
        <i class="icon-double-angle-up icon-only bigger-110"></i>
    </a>

</body>
</html>

<script type="text/javascript">

    $(function () {
        jeDate({
            dateCell: '#stime',
            isinitVal: new Date(),
            //isinitVal:false,
            format: 'YYYY-MM-DD', // 分隔符可以任意定义，该例子表示只显示年月
            minDate: '1900-06-01', //最小日期
            maxDate: '2050-06-01' //最大日期
        });
        jeDate({
            dateCell: '#etime',
            isinitVal: new Date(),
            //isinitVal:false,
            format: 'YYYY-MM-DD', // 分隔符可以任意定义，该例子表示只显示年月
            minDate: '1900-06-01', //最小日期
            maxDate: '2050-06-01' //最大日期
        });
    });
    var dtGridColumns = [
        {
            id: 'createTime',
            title: '创建时间',
            type: 'date',
            format: 'yyyy-MM-dd hh:mm:ss',
            columnClass: 'text-center',
            headerStyle: 'background:#00a2ca;color:white;',
            resolution: function (value, record, column, grid, dataNo, columnNo) {
                return new Date(value).Format("yyyy-MM-dd hh:mm:ss");
            }
        },
        {
            id: 'operModul',
            title: '操作模块',
            type: 'string',
            columnClass: 'text-center',
            headerStyle: 'background:#00a2ca;color:white;'
        },
        {
            id: 'operDesc',
            title: '操作描述',
            type: 'string',
            columnClass: 'text-center',
            headerStyle: 'background:#00a2ca;color:white;'
        },
        {
            id: 'requestUri',
            title: '请求地址',
            type: 'string',
            columnClass: 'text-center',
            hideType:'lg|md|sm|xs',
            headerStyle: 'background:#00a2ca;color:white;'
        },
        {
            id: 'requestParam',
            title: '请求参数',
            type: 'string',
            columnClass: 'text-center',
            hideType:'lg|md|sm|xs',
            headerStyle: 'background:#00a2ca;color:white;'
        },
        {
            id: 'responseParam',
            title: '返回参数',
            type: 'string',
            columnClass: 'text-center',
            hideType:'lg|md|sm|xs',
            headerStyle: 'background:#00a2ca;color:white;'
        },
        {
            id: 'operName',
            title: '操作人',
            type: 'string',
            columnClass: 'text-center',
            headerStyle: 'background:#00a2ca;color:white;'
        },
        {
            id: 'operIp',
            title: '操作ip',
            type: 'string',
            columnClass: 'text-center',
            headerStyle: 'background:#00a2ca;color:white;'
        }];
    var pageSize = $("#pageSize").val();
    pageSize = pageSize == 0 || pageSize == "" ? 10 : pageSize;

    var dtGridOption = {
        lang: 'zh-cn',
        ajaxLoad: true,
        check: false,
        loadURL: '${ctx}/monitor/operationLog',
        columns: dtGridColumns,
        gridContainer: 'dtGridContainer',
        toolbarContainer: 'dtGridToolBarContainer',
        exportFileName: '操作日志',
        pageSize: pageSize,
        pageSizeLimit: [10, 20, 50]
    };
    var grid = $.fn.dlshouwen.grid.init(dtGridOption);

    $(function () {
        if (null != $("#orderByColumn").val() && '' != $("#orderByColumn").val()) {
            grid.sortParameter.columnId = $("#orderByColumn").val();
            grid.sortParameter.sortType = $("#orderByType").val();
        }
        grid.parameters = new Object();
        var stime = $('#stime').val();
        var etime = $('#etime').val();
        grid.parameters['stime'] = stime;
        grid.parameters['etime'] = etime;
        grid.load();
        $("#btnSearch").click(customSearch);
    });

    /**
     * 自定义查询
     * 这里不传入分页信息，防止删除记录后重新计算的页码比当前页码小而导致计算异常
     */
    function customSearch() {
        var stime = $('#stime').val();
        var etime = $('#etime').val();
        grid.parameters = new Object();
        grid.parameters['stime'] = stime;
        grid.parameters['etime'] = etime;
        grid.refresh(true);
    }
</script>
